<template>
  <!-- 金融小店 -->
  <div class="madp-financial-shop">
    <div v-for="item in menuList" :key="item.id">
      <template v-if="item.status == 1">
        <component :is="componentSort[item.id]" :wxUserId="wxUserId" :wxExternalUserid="wxExternalUserid" :sort="item.sort"></component>
      </template>
    </div>
  </div>
</template>
<script>
import * as utils from '@/utils/util'
import financialShopApi from '@/api/financial-shop'
import ManagerInfoComponent from '@/components/financial-shop/manager-info'
import MorningPaperComponent from '@/components/financial-shop/morning-paper'
import ProductComponent from '@/components/financial-shop/product'
import LoansComponent from '@/components/financial-shop/loans'
import DepositComponent from '@/components/financial-shop/deposit'
import ActivityComponent from '@/components/financial-shop/activity'
import CreditCardComponent from '@/components/financial-shop/credit-card'
export default {
  components: { ManagerInfoComponent, MorningPaperComponent, ProductComponent, LoansComponent, DepositComponent, ActivityComponent, CreditCardComponent },
  props: {},
  data() {
    return {
      componentSort: {
        1: 'ProductComponent',
        2: 'ActivityComponent',
        3: 'DepositComponent',
        4: 'LoansComponent',
        5: 'CreditCardComponent',
        6: 'ManagerInfoComponent',
        7: 'MorningPaperComponent'
      },
      menuList: []
    }
  },
  props: {
    wxUserId: {
      type: String,
      default: ''
    },
    wxExternalUserid: {
      type: String,
      default: ''
    }
  },
  created() {},
  watch: {},
  mounted() {
    this.getMenuSout()
  },
  methods: {
    // 获取菜单排序
    getMenuSout() {
      financialShopApi.getMenuSort().then((res) => {
        let list = res.data.data
        this.menuList = list.sort((a, b) => a.sort - b.sort)
      })
    }
  }
}
</script>
<style lang="scss" scoped>
* {
  margin: 0;
  padding: 0;
  list-style: none;
}
.madp-financial-shop {
  padding: 16px;
  background: #f9f9f9;
  height: 100%;
  // height: 100vh;
  overflow: hidden;
  overflow-y: scroll;
}
</style>
